function expander (id, open_fn, close_fn) {
this.expander_cls = 'sxui-expander';
this.expander_body_cls = 'sxui-expander-body';
this.expander_head_cls = 'sxui-expander-head';
this.expander_body_closed_cls = 'sxui-expander-body-closed';
this.expander_head_closed_cls = 'sxui-expander-head-closed';
this.id = id;
this.status = true;
this.open_fn = open_fn;
this.close_fn = close_fn;
this.init = function () {
    this.bind_head_click();
}
this.get_head = function () {
    return $(this.div).find('.sxui-expander-head');
}
this.get_body = function () {
    return $(this.div).find('.sxui-expander-body');
}

this.bind_head_click = function () {
    var _this= this;
    $(id).find('.'+this.expander_head_cls).unbind('click'); 
    $(id).find('.'+this.expander_head_cls).click (function () {
        if (_this.status) { //open, then close
            _this.close();
        } else {
            _this.open();
        }
    });
}
this.open = function () {
    $(id).find('.'+this.expander_body_cls).slideDown();
    this.status = true;
    if (this.open_fn)
        this.open_fn();
}

this.close = function () {
    $(id).find('.'+this.expander_body_cls).slideUp();
    this.status = false;
    if (this.close_fn)
        this.close_fn();
}
this.init();
}
